<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>精准时间悬浮窗</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="float-window" id="floatWindow">
        <!-- 标题栏 -->
        <div class="title-bar">
            <span class="title">⏰ 精准时间</span>
            <div class="controls">
                <button class="control-btn" id="pinBtn" title="置顶/取消置顶">📌</button>
                <button class="control-btn" id="minimizeBtn" title="最小化">—</button>
                <button class="control-btn close-btn" id="closeBtn" title="隐藏">✕</button>
            </div>
        </div>

        <!-- 时间显示区域 -->
        <div class="time-section">
            <!-- 当前本地时间 -->
            <div class="time-block local-time">
                <div class="time-label">当前本地时间</div>
                <div class="time-display" id="localTime">00:00:00.000</div>
                <div class="millisecond" id="localMs">000ms</div>
            </div>

            <!-- 延迟信息 -->
            <div class="delay-info" id="delayInfo">
                <span class="delay-label">网络延迟:</span>
                <span class="delay-value" id="delayValue">-- ms</span>
            </div>

            <!-- 换算后时间 -->
            <div class="time-block target-time">
                <div class="time-label">换算后时间</div>
                <div class="time-display" id="targetTime">00:00:00.000</div>
                <div class="millisecond" id="targetMs">000ms</div>
            </div>
        </div>

        <!-- 配置区域 -->
        <div class="config-section">
            <div class="config-row">
                <label for="targetIp">目标IP:</label>
                <input type="text" id="targetIp" value="8.8.8.8" class="ip-input">
                <button id="pingBtn" class="ping-btn">测试</button>
            </div>
            <div class="config-row">
                <label for="advanceTime">提前量:</label>
                <input type="number" id="advanceTime" value="100" min="0" max="2000" step="10">
                <span>ms</span>
            </div>
        </div>
    </div>

    <script src="renderer.js"></script>
</body>
</html> 